<!--购物车页!-->
<template>
   <div class="cart">

       <van-checkbox-group v-model="result">
           <van-checkbox
            :name="item"
            v-for="item in cartList" 
            :key="item.id"
            @click="checkoneFn"
           >
              <van-card
               :num="item.number"
               :price="item.market_price"
               :desc="item.goods_specifition_name_value"
               :title="item.goods_name"
               :thumb="item.list_pic_url"
               />
           </van-checkbox>
            
       </van-checkbox-group>
    <van-submit-bar :price="totalprice"  button-text="提交订单" @submit="onSubmit">
    <van-checkbox v-model="checkedAll" @click="checkallFn">全选</van-checkbox>
    <template #tip>
       
        你的收货地址不支持同城送, <span @click="onClickEditAddress">修改地址</span>
    </template>
    </van-submit-bar>
   </div>

</template>

<script>
import {getCart} from '@/utils/https.js'

export default {
data(){
    return{
        result:[],
        cartList:[],
        checkedAll:false
    }

},
computed:{
    totalprice(){
          let sum = 0;
        this.result.forEach((item) => {
          
            sum += item.retail_price*item.number*100;
            
        });
        return sum;
    }
},
created(){
    getCart().then((res) =>{
        console.log(res);
        this.cartList = res.data.data.cartList
    })
    console.log(this.totalprice);
    //
},
methods:{
    onSubmit(){
        console.log(111);
         console.log(this.result);
         console.log(this.totalprice);
    },
    onClickEditAddress(){
        console.log(222);
    },
    checkallFn(){
    if(this.checkedAll){
        this.result = this.cartList
    }else{
        this.result = []
    }
    },
    checkoneFn(){
        if(this.result.length == this.cartList.length){
            this.checkedAll = true
        }else{
             this.checkedAll = false
        }
    }
},

}
</script>

<style lang='less' scoped>
    .cart{
        padding-bottom: 200px;
        overflow: hidden;
        .van-checkbox{
            border-radius: 10px;
            border: 1px solid rgb(228, 221, 221);
            margin:  3px;
            background: #fafafa;
            display: flex;
            /deep/.van-checkbox__label{
                flex: 1;
                
            }
        }
        .van-submit-bar{
            bottom: 50px;
        }
    }

</style>